<template>
  <div class="td-patient-me-address-modify">
    <mt-header fixed :title="this.$route.params.AddressID?'修改地址':'添加地址'">
      <router-link to="tdAddress" slot="left" v-if="type===0">
        <mt-button icon="back"></mt-button>
      </router-link>
      <router-link to="tdPatientDelection" slot="left" v-if="type===1">
        <mt-button icon="back"></mt-button>
      </router-link>
    </mt-header>

    <mt-field label="收货人" v-model="params.ReceiverName" placeholder="请输入收货人"></mt-field>
    <mt-field label="手机号" v-model="params.MobilePhone" placeholder="请输入手机号" type="number"></mt-field>
    <mt-field label="邮政编码" v-model="params.ZipCode" placeholder="请输入邮政编码" type="number"></mt-field>
    <mt-cell title="地址">
      <span @click="showAddress=true">{{values.toString()}}</span>
    </mt-cell>
    <mt-field label="详细信息" v-model="params.StreetDetail" placeholder="请输入详细信息" type="textarea"></mt-field>

    <mt-cell title="默认地址">
      <el-switch v-model="IsDefault" active-color="#f2707a" @change="getDefault"></el-switch>
    </mt-cell>

    <div class="btnSubmit">
      <el-button
        type="primary"
        class="td-btn-patient-primary"
        @click="btnSave();"
        style="width:80%;"
        round
      >保存</el-button>
    </div>

    <mt-popup v-model="showAddress" position="bottom" class="mint-popup-box">
      <mt-header title="地址">
        <mt-button slot="right" @click.native="showAddress=false">关闭</mt-button>
      </mt-header>
      <td-address :values="values" @change="getAddress"></td-address>
    </mt-popup>
  </div>
</template>
<script>
import userAddressService from "../../../../../_services/userAddress.service";
export default {
  name: "TianDingPatientMeAddressModifyComponent",
  data() {
    return {
      type: 0,
      user: {},
      values: ["北京市", "市辖区", "朝阳区"],
      showAddress: false,
      IsDefault: true,
      params: {
        AddressID: 0,
        UserID: 0,
        ReceiverName: "",
        MobilePhone: "",
        ProviceName: "",
        CityName: "",
        AreaName: "",
        StreetDetail: "",
        ZipCode: "",
        IsDefault: 0,
        CreateTime: ""
      }
    };
  },
  mounted() {
    this.user = this.utils$.dataFormat(
      JSON.parse(this.local$.getItem("tdUser"))
    );
    if (this.$route.params.type !== undefined) {
      this.type = this.$route.params.type;
    }
    if (this.$route.params.AddressID) {
      this.params = this.$route.params;
      this.IsDefault = this.params.IsDefault === 1;
      this.values = [
        this.params.ProviceName,
        this.params.CityName,
        this.params.AreaName
      ];
    }
  },
  methods: {
    getAddress(event) {
      this.values = event;
      this.params.ProviceName = event[0];
      this.params.CityName = event[1];
      this.params.AreaName = event[2];
    },
    getDefault(event) {
      this.params.IsDefault = event ? 1 : 0;
    },
    btnSave() {
      this.params.UserID = this.user.UserID;
      console.log(this.params);
      if (this.params.AddressID > 0) {
        userAddressService.updateUserAddress(this.params).then(response => {
          this.response(response);
        });
      } else {
        userAddressService.addUserAddress(this.params).then(response => {
          this.response(response);
        });
      }
    },
    response(response) {
      if (response !== null && response.Data > 0) {
        this.toast$("保存成功！");
      } else {
        this.toast$("保存失败！");
      }
      if (this.type === 0) {
        this.$router.push({ name: "tdAddress" });
      } else {
        this.$router.push({ name: "tdPatientDelection" });
      }
    }
  }
};
</script>
